<nav class="mt-10">
    @foreach($menus as $menu)
        <a x-data="{ active: {{ \Illuminate\Support\Str::startsWith('/' . request()->path(), [$menu->url]) ? 'true' : 'false' }} }" :class="active ? 'bg-gray-700 bg-opacity-25 text-gray-100' : 'text-gray-500'" class="flex items-center mt-4 py-2 px-6 hover:bg-gray-700 hover:bg-opacity-25 hover:text-gray-100" href="{{ $menu->url }}">

            @if(config('svg.' . $menu->icon, ''))
            <svg xmlns="http://www.w3.org/2000/svg" viewBox="-2 -2 24 24" width="18" height="18" preserveAspectRatio="xMinYMin" fill="none" stroke="currentColor">
                {!! config('svg.' . $menu->icon, '') !!}
            </svg>
            @endif
            <span class="mx-3">{{ $menu->title }}</span>
        </a>
    @endforeach
</nav>
